<!DOCTYPE html>
<html>
<head>

<title>Spar</title>

<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- 
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
	 -->
<link type="text/css" rel="stylesheet"
	href="/css/jquery.mobile-1.1.0.css" />
<link type="text/css" rel="stylesheet" href="/design/style.css" />
<link type="text/css" rel="stylesheet"
	href="/css/mobiscroll-2.0rc3.custom.min.css" />

<script type="text/javascript" src="/javascript/jquery.js"></script>
<script type="text/javascript" src="/javascript/jquery.mobile-1.1.0.js"></script>
<script type="text/javascript"
	src="/javascript/mobiscroll-2.0rc3.custom.min.js"></script>


<script src="/javascript/ajax.js">
	
</script>


</head>
<body>

	<div data-role='page' id="gameInfo">

		<div id="colorline"></div>
		<header>
			<span class="headerText">Spar</span>
		</header>

		<div data-role='content'>
			<table>
				<tr>
					<td>Round</td>
					<td><input type="number" pattern="[0-9]*" id="iRound" /></td>
				</tr>
				<tr>
					<td>Table</td>
					<td><input type="number" pattern="[0-9]*" id="iTable" /></td>
				</tr>
				<tr>
					<td>Section</td>
					<td><input type="text" id="iSection" pattern="[A-Z]*"
						value="A" /></td>
				</tr>
			</table>
			<a onClick="sendRoundData()" data-role="button" data-theme="i"
				data-inline="true">OK</a>
		</div>

	</div>

	<div data-role='page' id="membernr">

		<div id="colorline"></div>
		<header>
			<span class="headerText"></span>
		</header>

		<div class="ui-grid-b">
			<div class="ui-block-a" id="block-table"></div>
			<div class="ui-block-b" id="block-round"></div>
			<div class="ui-block-c" id="block-boards"></div>
		</div>

		<div id="enterPlayer">
			<p>Enter player numbers:</p>

		</div>

		<div data-role='content'>
			<table>
				<tr>
					<td>North:</td>
					<td></td>
					<td><input type="number" pattern="[0-9]*" id="inputN" /></td>
				</tr>
				<tr>
					<td>South:</td>
					<td></td>
					<td><input type="number" pattern="[0-9]*" id="inputS" /></td>
				</tr>
				<tr>
					<td>East:</td>
					<td></td>
					<td><input type="number" pattern="[0-9]*" id="inputE" /></td>
				</tr>
				<tr>
					<td>West:</td>
					<td></td>
					<td><input type="number" pattern="[0-9]*" id="inputW" /></td>
				</tr>

			</table>


			<a onclick="sendPlayerInfo()" data-role="button" data-theme="b" data-inline="true">OK</a>
		</div>

	</div>

	<div data-role='page' id="players">

		<div id="colorline"></div>
		<header>
			<span class="headerText"></span>
		</header>

		<div data-role='content'>
			<div class='content-primary'>

				<div class="ui-grid-b">
					<div class="ui-block-a" id="block-tablePI"></div>
					<div class="ui-block-b" id="block-roundPI"></div>
					<div class="ui-block-c" id="block-boardsPI"></div>
				</div>

				<ul data-role="listview" data-theme="c" data-inset="true"
					id="playerList">

				</ul>
			</div>
			<a href="#resultSummary" onclick="updateSummaryTable()"
				data-role="button" data-theme="i" data-inline="true">OK</a>
		</div>

	</div>

	<div data-role='page' id="resultReg">

		<div id="colorline"></div>
		<header>
			<span class="headerText"></span>
		</header>

		<div class="ui-grid-b">
			<div class="ui-block-a" id="block-tableRR"></div>
			<div class="ui-block-b" id="block-roundRR"></div>
			<div class="ui-block-c" id="block-boardsRR"></div>
		</div>


		<h3 id="legendBoard"></h3>
		<input name="i" id="i" class="i-txt" data-role="none" type="hidden" />
		<input id="hiddenBoard" data-role="none" type="hidden" />
		<a onclick="addToResultArray()" data-role="button" data-theme="i"
			data-inline="true">Save</a>
	</div>

	<div data-role='page' id="resultSummary">

		<div id="colorline"></div>
		<header>
			<span class="headerText"></span>
		</header>

		<div class="ui-grid-b">
			<div class="ui-block-a" id="block-tableRS"></div>
			<div class="ui-block-b" id="block-roundRS"></div>
			<div class="ui-block-c" id="block-boardsRS"></div>
		</div>

		<div data-role='content'>
			<table id="summary-table">
			</table>


			<a data-role="button" data-theme="i" onclick="sendResultArray()"
				data-inline="true">Finish Round</a>
		</div>

	</div>

	<div data-role='page' id="score">

		<div id="colorline"></div>
		<header>
			<span class="headerText"></span>
		</header>

		<div data-role='content'>

			<table id="scoreTable">
				<tr>
					<th>NS</th>
					<th>EW</th>
				</tr>
			</table>

		</div>

	</div>

</body>
</html>